<!doctype html>
<!-- Conditional comment for mobile ie7 http://blogs.msdn.com/b/iemobile/ -->
<!--[if IEMobile 7 ]>    <html class="no-js iem7"> <![endif]-->
<!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js"> <!--<![endif]-->

<head>
  <meta charset="utf-8">

  <title></title>
  <meta name="description" content="">
  <meta name="author" content="">

  <!-- Mobile viewport optimization http://goo.gl/b9SaQ -->
  <meta name="HandheldFriendly" content="True">
  <meta name="MobileOptimized" content="320">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!-- Home screen icon  Mathias Bynens http://goo.gl/6nVq0 -->
  <!-- For iPhone 4 with high-resolution Retina display: -->
  <link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/h/apple-touch-icon.png">
  <!-- For first-generation iPad: -->
  <link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/m/apple-touch-icon.png">
  <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
  <link rel="apple-touch-icon-precomposed" href="img/l/apple-touch-icon-precomposed.png">
  <!-- For nokia devices: -->
  <link rel="shortcut icon" href="img/l/apple-touch-icon.png">

  <!--iOS web app, deletable if not needed -->
  <!--the script prevents links from opening in mobile safari. https://gist.github.com/1042026
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <script>(function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")</script>
  <link rel="apple-touch-startup-image" href="img/l/splash.png">-->

  <!-- Mobile IE allows us to activate ClearType technology for smoothing fonts for easy reading -->
  <meta http-equiv="cleartype" content="on">

  <!-- more tags for your 'head' to consider https://gist.github.com/849231 -->

 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>


  <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
  <script src="js/libs/modernizr-custom.js"></script>
  <!-- Media Queries Polyfill https://github.com/shichuan/mobile-html5-boilerplate/wiki/Media-Queries-Polyfill -->
  <script>Modernizr.mq('(min-width:0)') || document.write('<script src="js/libs/respond.min.js">\x3C/script>')</script>
</head>

<body>

<div data-role="page" id="page3"> 
  <div data-role="header">
    <a data-role="button" data-rel="back" data-icon="arrow-l">Back</a>
    <h1>Get Status</h1>
  </div>
  <div data-role="content">
   <form>
   <select id="routelist">
   </select>
 
   <button type="button" id="updatestatusbutton" data-theme="a">Update Status</button>
   </form>
    <div id="results"></div>
    <div id="location"></div>
  </div>


  <!-- JavaScript at the bottom for fast page loading -->

  <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
  <!--<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  <script>window.jQuery || document.write('<script src="js/libs/jquery-1.6.2.min.js"><\/script>')</script>
-->
  <!-- scripts concatenated and minified via ant build script -->
  <script src="js/mylibs/helper.js"></script>
  <!-- end concatenated and minified scripts-->

  <script>
    // iPhone Scale Bug Fix, read this when using http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/
    MBP.scaleFix();
  </script>

  <!-- Debugger - remove for production -->
  <!-- <script src="https://getfirebug.com/firebug-lite.js"></script> -->

  <!-- mathiasbynens.be/notes/async-analytics-snippet Change UA-XXXXX-X to be your site's ID -->
  <script>
    var _gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]];
    (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1;
    g.src=("https:"==location.protocol?"//ssl":"//www")+".google-analytics.com/ga.js";
    s.parentNode.insertBefore(g,s)}(document,"script"));
  </script>

  <script>
      //$(document).ready(function () {
      $('#page3').live('pageinit', function (event) {
          $.getJSON('SampleRouteList.txt', function (data) {
              routeData = data;
              var html = '';
              html += '<option value="">Select Route</option>';
              var len = data.routes.length;
              for (var i = 0; i < len; i++) {
                  html += '<option value="' + data.routes[i].routeId + '">Route ' + data.routes[i].routeName + '</option>';
              }
              $('#routelist').html(html);

              $('#routelist').selectedIndex = 0;
              $('#routelist').selectmenu("refresh");
          });

          // add markup to container and apply click handlers to anchors
          $("#updatestatusbutton").click(function (e) {
              // stop normal link click
              e.preventDefault();
              
              var url = "http://143.215.102.187/rhokatl/web_gateway.php?api_method=update&route_id=" + $('#routelist').val() + "&stop_id=" + $('#stoplist').val();
            $.getJSON(url, function (data) {});
                
                

              $('#results').replaceWith('Update successful.  Thank you for participating!<br/>');
          });
      });

      $('#page3').live('pageinit', initiate_geolocation);
      //$(document).ready(initiate_geolocation);

      function initiate_geolocation() {
          navigator.geolocation.getCurrentPosition(handle_geolocation_query, handle_errors);
      }

      function handle_errors(error) {
          switch (error.code) {
              case error.PERMISSION_DENIED: alert("we knew you would do that");
                  break;

              case error.POSITION_UNAVAILABLE: alert("could not detect current position");
                  break;

              case error.TIMEOUT: alert("retrieving position timed out");
                  break;

              default: alert("something went terribly wrong");
                  break;
          }
      }

      function handle_geolocation_query(position) {
          $('#location').replaceWith('Lat: ' + position.coords.latitude + '<br/>' +
                  ' Lon: ' + position.coords.longitude);
      }  
  </script>

  </div>


</body>
</html>
